<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <!-- build:css /static/lib/list.min.css -->
    <link href="/static/lib/css/mui.css" rel="stylesheet"/>
    <!-- endbuild -->
    <!-- build:css /static/components/search_result.min.css -->
    <link href="/static/components/css/iconfont.css" rel="stylesheet" type="text/css"/>
    <link href="/static/components/css/hot.css" rel="stylesheet" type="text/css"/>
    <!-- endbuild -->
</head>

<body>
<header class="mui-bar mui-bar-nav">
    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" href="{{ url_for('home.game_search') }}"></a>
    <h1 class="mui-title">搜索结果</h1>
</header>
<div class="mui-content">
    <div id="hot_item">
        <ul id="hot_ul" class="mui-table-view">
            <!--<li class="mui-table-view-cell mui-media">
                <a href="javascript:;">
                    <img class="mui-media-object mui-pull-left" src="../static/components/img/qbyx/qbyx_icon_14.png">
                    <div class="mui-media-body main_title">
                        王者荣耀-<span class="allgame_column_title_tail">三天成霸业</span>
                    </div>
                    <div class="mui-media-body">
                        <div style="display: inline;">
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="final_score">&nbsp;&nbsp;5.0</span>
                        </div>
                        <span class="mui-pull-right iconfont icon-xiazai hot_download button_download">下载</span>
                    </div>
                    <div class="mui-media-body mui-ellipsis">
                        <span class="game_type">竞技</span>
                        <span class="game_type">对抗</span>
                    </div>
                </a>
            </li>

            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;">
                    <img class="mui-media-object mui-pull-left" src="../static/components/img/qbyx/qbyx_icon_21.png">
                    <div class="mui-media-body main_title">
                        阴阳师-<span class="allgame_column_title_tail">开启唯美奇幻之旅</span>
                    </div>
                    <div class="mui-media-body">
                        <div style="display: inline;">
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xingxing"></span>
                            <span class="final_score">&nbsp;&nbsp;4.0</span>
                        </div>
                        <span class="mui-pull-right iconfont icon-xiazai hot_download button_download">下载</span>
                    </div>
                    <div class="mui-media-body mui-ellipsis">
                        <span class="game_type">竞技</span>
                        <span class="game_type">对抗</span>
                    </div>
                </a>
            </li>

            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;">
                    <img class="mui-media-object mui-pull-left" src="../static/components/img/qbyx/qbyx_icon_42.png">
                    <div class="mui-media-body main_title">
                        龙之谷-<span class="allgame_column_title_tail">3DARPG手游</span>
                    </div>
                    <div class="mui-media-body">
                        <div style="display: inline;">
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xingxing"></span>
                            <span class="final_score">&nbsp;&nbsp;4.0</span>
                        </div>
                        <span class="mui-pull-right iconfont icon-xiazai hot_download button_download">下载</span>
                    </div>
                    <div class="mui-media-body mui-ellipsis">
                        <span class="game_type">竞技</span>
                        <span class="game_type">对抗</span>
                    </div>
                </a>
            </li>
            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;">
                    <img class="mui-media-object mui-pull-left" src="../static/components/img/qbyx/qbyx_icon_77.png">
                    <div class="mui-media-body main_title">
                        主宰灵域-<span class="allgame_column_title_tail">三世桃花劫</span>
                    </div>
                    <div class="mui-media-body">
                        <div style="display: inline;">
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xingxing"></span>
                            <span class="final_score">&nbsp;&nbsp;4.0</span>
                        </div>
                        <span class="mui-pull-right iconfont icon-xiazai hot_download button_download">下载</span>
                    </div>
                    <div class="mui-media-body mui-ellipsis">
                        <span class="game_type">竞技</span>
                        <span class="game_type">对抗</span>
                    </div>
                </a>
            </li>
            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;">
                    <img class="mui-media-object mui-pull-left" src="../static/components/img/qbyx/qbyx_icon_98.png">
                    <div class="mui-media-body main_title">
                        苍穹变-<span class="allgame_column_title_tail">天蚕土豆监制</span>
                    </div>
                    <div class="mui-media-body">
                        <div style="display: inline;">
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xingxing"></span>
                            <span class="final_score">&nbsp;&nbsp;4.0</span>
                        </div>
                        <span class="mui-pull-right iconfont icon-xiazai hot_download button_download">下载</span>
                    </div>
                    <div class="mui-media-body mui-ellipsis">
                        <span class="game_type">竞技</span>
                        <span class="game_type">对抗</span>
                    </div>
                </a>
            </li>
            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;">
                    <img class="mui-media-object mui-pull-left" src="../static/components/img/qbyx/qbyx_icon_113.png">
                    <div class="mui-media-body main_title">
                        寻找前世之旅-<span class="allgame_column_title_tail">登录送翅膀</span>
                    </div>
                    <div class="mui-media-body">
                        <div style="display: inline;">
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xingxing"></span>
                            <span class="final_score">&nbsp;&nbsp;4.0</span>
                        </div>
                        <span class="mui-pull-right iconfont icon-xiazai hot_download button_download">下载</span>
                    </div>
                    <div class="mui-media-body mui-ellipsis">
                        <span class="game_type">竞技</span>
                        <span class="game_type">对抗</span>
                    </div>
                </a>
            </li>
            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;">
                    <img class="mui-media-object mui-pull-left" src="../static/components/img/qbyx/qbyx_icon_121.png">
                    <div class="mui-media-body main_title">
                        九阳神功：起源-<span class="allgame_column_title_tail">3D真武侠</span>
                    </div>
                    <div class="mui-media-body">
                        <div style="display: inline;">
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xing1"></span>
                            <span class="iconfont icon-xingxing"></span>
                            <span class="final_score">&nbsp;&nbsp;4.0</span>
                        </div>
                        <span class="mui-pull-right iconfont icon-xiazai hot_download button_download">下载</span>
                    </div>
                    <div class="mui-media-body mui-ellipsis">
                        <span class="game_type">竞技</span>
                        <span class="game_type">对抗</span>
                    </div>
                </a>
            </li>-->

        </ul>
        <div id="no_result">
            <span>没有搜索到结果</span>
        </div>
    </div>
</div>
<!-- build:js /static/js/search_result.min.js -->
<script src="/static/lib/js/mui.min.js"></script>
<script src="/static/lib/js/jquery.js" type="text/javascript"></script>
<script src="/static/components/js/util.js" type="text/javascript" charset="utf-8"></script>
<!-- endbuild -->

<script src="/static/components/js/ag.js" type="text/javascript"></script>

<script>
    window.onload = function () {
        var base_url = '{{ g.api_url }}';
        var channel_code = '{{ g.channel_code }}';

        loadingAnalyze('{{ g.analyze_url }}');

        request(base_url + '/game/member/game', {"type": "map", "content": {"name": localStorage.getItem('search')}})
                .done(function (data) {
                    dealSearchResultList(data);
                })
                .fail(function () {
                    console.log('dealSearchResultList error');
                });

        function dealSearchResultList(json) {
            if (json.total == '0') {
                var no_result = document.getElementById('no_result');
                no_result.style.visibility = 'visible';
                return;
            }

            var oUl = document.getElementById('hot_ul');

            for (var hotgame_list_num = 0; hotgame_list_num < json.items.length; hotgame_list_num++) {
                var newli = document.createElement('li');
                newli.className = 'mui-table-view-cell mui-media';
                /*获取星星显示的span*/
                var starSpan = '';
                var score_avg = json.items[hotgame_list_num].score_avg == null ? '5.0' : json.items[hotgame_list_num].score_avg; //分数
                var score_avg_x10 = score_avg * 10;
                var score_avg_x10_ = score_avg_x10 % 10;
                if (score_avg_x10_ > 0 && score_avg_x10_ <= 5) {
                    needHalfStar = true;
                } else {
                    needHalfStar = false;
                }
                //							alert(needHalfStar);
                for (var home_hotgame_starnum = 0; home_hotgame_starnum < 5; home_hotgame_starnum++) {
                    if (home_hotgame_starnum < parseInt(score_avg)) {
                        starSpan += '<span class="iconfont icon-xing1"></span>';
                    } else {
                        if (home_hotgame_starnum == parseInt(score_avg) && needHalfStar) {
                            starSpan += '<span class="iconfont icon-ban_xing2"></span>';
                        } else {
                            if (home_hotgame_starnum == parseInt(score_avg) && score_avg_x10_ > 5) {
                                starSpan += '<span class="iconfont icon-xing1"></span>';
                            } else {
                                starSpan += '<span class="iconfont icon-xingxing"></span>';
                            }
                        }
                    }
                }

                //有颜色的tag
                var all_tag_span = '';
                var colors = ["#7cc9ff", "#ff9999", "#4cac47", "#ffae00", "#b057ca", "#ffae00"];
                for (var colorsnum = 0; colorsnum < json.items[hotgame_list_num].categories.length; colorsnum++) {
                    var n = Math.floor(Math.random() * colors.length + 1) - 1;
                    var span = document.createElement('span');
                    span.className = 'tag_flag';
                    span.style.color = colors[n];
                    span.style.borderStyle = "solid ";
                    span.style.borderWidth = "1px ";
                    span.style.borderColor = colors[n];
                    span.innerText = json.items[hotgame_list_num].categories[colorsnum].name;
                    all_tag_span += span.outerHTML;
                }

                var tmpHtml = '<a href="javascript:;"><img class="mui-media-object mui-pull-left" src="' +
                        json.items[hotgame_list_num].icon + //图片地址
                        '"><div class="mui-media-body main_title">' +
                        json.items[hotgame_list_num].game_name + //主标题
                        '-<span class="allgame_column_title_tail">' +
                        json.items[hotgame_list_num].game_title + //副标题
                        '</span></div><div class="mui-media-body"><div style="display: inline;">' +
                        starSpan + //星星
                        '<span class="final_score">&nbsp;&nbsp;' +
                        formateFixedOne(score_avg) + //分数
                        '</span></div><span class="mui-pull-right iconfont icon-xiazai hot_download button_download" data_android_link="' +
                        getRealLink(json.items[hotgame_list_num].channel_game.android_link,json.items[hotgame_list_num].android_link) + //安卓链接
                        '" data_ios_link ="' +
                        getRealLink(json.items[hotgame_list_num].channel_game.ios_link,json.items[hotgame_list_num].ios_link) + //IOS链接
                        '" data-code ="' +
                        json.items[hotgame_list_num].code + //data-code
                        '" data-id ="' +
                        localStorage.getItem('user_id') + //data-code
                        '">下载</span></div><div class="mui-media-body mui-ellipsis">' +
                        all_tag_span + //类型
                        '</div></a>';

                newli.innerHTML = tmpHtml;
                newli.id = json.items[hotgame_list_num].id;
                oUl.appendChild(newli);
            }
        }

        function initClick() {

            mui('#hot_ul').on('tap', 'li', function () {
                window.name = this.id;
                window.location.href =  '{{ url_for('home.game_detail', game_id='') }}'+ this.id;;
                return false;
            });
            mui('#hot_ul').on('tap', '.button_download', function () {
                download(this, isIOSClient(), this.getAttribute('data_ios_link'), this.getAttribute('data_android_link'));
                return false;
            });
        }

        initClick();
    };
</script>
</body>

</html>